<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../resource/ystfiles/wapcommon.css">
    <link rel="stylesheet" href="../../resource/ystfiles/weuimin.css">
    <style>
  	.odiv{
		   display:table;
		   background:#fff;
		   width:100%;
		   padding:5px;
		   border-top:1px solid #E1E1E1; 
		   border-bottom:1px solid #E1E1E1;
	   }
	   .odiv1{
		   display:table;
		   background:#fff;
		   width:100%;
		   padding:5px;
		   border-top:1px solid #E1E1E1; 
		   border-bottom:1px solid #E1E1E1;
	   }
	   .idiv{
		   float: left;
		   font-size:15px;
		   margin-left: 10px;
		   height:40px;
		   line-height:40px;
	   }
	   .idiv1{
		   float: left;
		   font-size:15px;
		   margin-left: 10px;
		   min-height:40px;
		   line-height:40px;
	   }
	   .div_text{
		   float: right;
		   height:40px;
		   line-height:40px;
		   width:65%;
		   color: #8d8d8d;
		   font-size:15px;
		   text-align: right;
		   overflow:hidden;
		   white-space: nowrap; 
		   text-overflow: ellipsis;
		   margin-right:10px;
	   }
	    textarea:focus {
		    outline: none;
		}
	   .div_text1{
		   float: right;
		   min-height:40px;
		   width:65%;
		   color: #8d8d8d;
		   font-size:15px;
		   text-align: right;
		   overflow:hidden;
		   white-space: nowrap; 
		   text-overflow: ellipsis;
		   margin-right:10px;
	   }
	   .ipt{
	     border:none;
	     outline:none;
	     width:100%;
	     font-size:16px;
	   }
	   .div_img{
	       float: left;
	       width: 100%;
	       text-align: center;
	       height: 200px;
	       line-heigth: 200px;
	    }
	   body {
	    overflow-x:hidden;
	    margin: 0;
	   }
	   html {
	    overflow-x:hidden;
	   }
    </style>
</head>
<body style="background:url(../../image/bj.png) repeat-x 0;background-size:100%;">
<div style="background:url(../../image/mainbg.png) no-repeat right 0 bottom 0%;">
<div>
	<header id="statusBar">
		<div style="width:100%;display:table;background: #fff;position:fixed;border-bottom:1px solid #EAEAEA;z-index: 9999;height: 50px;" >
			<div style="float:left;width: 20%;height: 50px;line-height: 50px;" tapmode="presshover" onclick="api.closeWin();">
			  <div style="float:left;width: 30%;height: 50px;">
			   <img style="width: 24px;margin-top: 13px;" src="../../image/blc_back.png" />
			   </div>
			   <div style="float:left;width: 50%;">
			   返回
			   </div>
			</div>
			<div style="float:left;width: 60%;height: 50px;line-height: 50px;text-align: center;font-weight:bold;">
			 人员信息
			</div>
		</div>
	</header>
	<div style="height: 50px;"></div>
	  <div id="loadingToast" style="display:none;">
	        <div class="weui-mask_transparent"></div>
	        <div class="weui-toast">
	            <i class="weui-loading weui-icon_toast"></i>
	            <p class="weui-toast__content">数据加载中</p>
	        </div>
	  </div>
      <div style="height:20px"></div>
      <div class='odiv'>  
		  <div class='idiv'>进沟时间</div>
		  <div class="div_text" style="margin-right:20px;">
		  <input  type="date" class="ipt" id="enterDate" />
		  </div>
	  </div>
	  <div class='odiv'>  
		  <div class='idiv'>出沟时间</div>
		  <div class="div_text" style="margin-right:20px;">
		  <input  type="date" class="ipt" id="leaveDate"/>
		  </div>
	  </div>
	  <div class='odiv'>  
		  <div class='idiv'>进沟事由</div>
		  <div class="div_text" style="margin-right:20px;">
		  <textarea id="enterReason" style="width: 100%;font-size:15px;margin-top: 5px;"></textarea>
		  </div>
	  </div>
      <div class="odiv">
      	<div style="text-align: left;height:40px;line-height:40px;font-size: 20px" id="thr">
      	
      	</div>
      </div>
      <input id="id" style="display: none" />
	  <div class='odiv'>  
		  <div class='idiv'>姓名</div>
		  <div class="div_text" style="margin-right:20px;">
		  <input  type="text" class="ipt" id="driverName" placeholder="请输入驾驶员姓名"/>
		  </div>
	  </div>
	  <div class='odiv'>  
		  <div class='idiv'>身份证</div>
		  <div class="div_text" style="margin-right:20px;">
		  <input  type="text" class="ipt" id="driverCard" placeholder="请输入驾驶员身份证"/>
		  </div> 
	  </div>
	  <div class='odiv' id="car_no">  
		  <div class='idiv'>车牌号</div>
		  <div class="div_text" style="margin-right:20px;">
		  <input  type="text" class="ipt" id="plateNum" placeholder="请输入车牌号"/>
		  </div> 
	  </div>
	  <div class='odiv'>  
		  <div class='idiv'>联系方式</div>
		  <div class="div_text" style="margin-right:20px;">
		  <input  type="text" class="ipt" id="driverTelephone" placeholder="请输入联系方式"/>
		  </div> 
	  </div>
	  
	  <div style="height:20px"></div>
	  
	  
	  <div id="CkList">
	  </div>
	  
	  <div style="text-align:center;width:40%;height:35px;background: #32CD32;margin: 10px auto;color:#fff;line-height: 35px;border-radius:5px;" onclick="addCk()" tammode="presshover" >添加人员</div>
	  
	  <div id="tjzp" style="display: table;width: 100%;margin-top: 20px;">
		  <div class="div_img">
	          <div tapmode="presshover" onclick="choosePic()" style="text-align:center;width:180px;height: 180px;margin: 0 auto;vertical-align: middle;">
	             <img id="clzp" src="../../image/tabBar/clgl_mrcl.jpg" style="max-width:180px;max-height:180px;border-radius: 5px;"/>
	             <input type="hidden" id="pic" />
	          </div>
	          <div style="color: #8d8d8d;">车辆照片</div>
		  </div>
	  </div>
	  
	  <div style="padding: 20px 0;width:100%;text-align: center;margin-top: 20px;" >
	  	<a style="width:40%;height:35px;background: #27a8fa;margin:0 auto;color:#fff;line-height: 35px;border-radius:5px;" onclick="updateCL();" tapmode="presshover">修改</a>
		<a style="width:40%;height:35px;background: #27a8fa;margin-left:40px;color:#fff;line-height: 35px;border-radius:5px;" onclick="deleteCL();" tapmode="presshover">删除</a>
	  </div>
	</div>
</div>	
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../resource/jquery1.js"></script>
<script type="text/javascript" charset="UTF-8" src="../../script/naes.js"></script>
<script type="text/javascript" src="../../script/constants.js"></script>
<script type="text/javascript">
	var is_audit;
	var haveCar;
	apiready = function(){
		api.parseTapmode();
		$api.fixStatusBar($api.dom('header'));
		if(api.systemType=="ios"){
			document.getElementById("statusBar").style.background="#298cb4";
		}
		$("#loadingToast").show();
		var path;
		//clck_type 0 管理人员 1普通车主
		var clck_type = api.pageParam.clck_type;
		if(clck_type==0){
			path= url.getSceneryInfo;
		}else{
			$("#tjzp").hide();
			path=url.getDriverInfo;
		}
		var id = api.pageParam.cl_id;
		api.ajax({
	        url:path,
	        method:'post',
	        data:{
	        	values:{
	        		id:id
	        	}
	        }
        },function(ret,err){
        	$("#loadingToast").hide();
        	if(ret){
        		if(ret.success){
        			var main = ret.main;
        			$("#enterDate").val(main.ENTER_DATE);
        			$("#leaveDate").val(main.LEAVE_DATE);
        			$("#enterReason").val(main.ENTER_REASON);
        			$("#id").val(id);
        			$("#driverName").val(main.DRIVER_NAME);
		        	$("#driverCard").val(main.DRIVER_CARD);
		        	if(main.PLATE_NUM == undefined || main.PLATE_NUM == "undefined"){
		        	  $("#car_no").hide();
		        	  $("#thr").html("无车辆人员信息");
		        	  haveCar = false;
		        	}else{
		        	  haveCar = true;
		        	  $("#thr").html("驾驶员信息");
		        	  $("#plateNum").val(main.PLATE_NUM);
		        	}
		        	$("#driverTelephone").val(main.DRIVER_TELEPHONE);
		        	if(clck_type==0){
		        		if(main.CAR_PHOTO!=null && main.CAR_PHOTO!="" &&main.CAR_PHOTO!=undefined){
		        			$("#clzp").attr("src",main.CAR_PHOTO);
		        		}
		        		if(main.IS_AUDIT!=0){
		        			is_audit = 1;
		        		}
		        	}
        			var detail = ret.detail;
        			if(detail.length>0){
        				var CkList = document.getElementById("CkList");
        				for(var i=0;i<detail.length;i++){
        					var passengerTelephone = detail[i].PASSENGER_TELEPHONE;
        					if(passengerTelephone==null||passengerTelephone==undefined){
        						passengerTelephone="";
        					}
							var div = document.createElement("div");
							div.innerHTML="<div style='border-top:2px solid #555555;border-bottom:2px solid #555555;margin-top:5px;'> "+
										  " <div class='odiv'> "+
										  " <div class='idiv'>姓名</div> "+
							  			  " <div class='div_text' style='margin-right:20px;'> "+
							  			  " <input  type='text' class='ipt' name='passengerName' value='"+detail[i].PASSENGER_NAME+"' placeholder='请输入人员姓名'/> "+
							  			  " </div> "+
						  				  " </div> "+
						  				  " <div class='odiv'> "+
										  " <div class='idiv'>身份证号</div> "+
							  			  " <div class='div_text' style='margin-right:20px;'> "+
							  			  " <input  type='text' class='ipt' name='passengerIdcard' value='"+detail[i].PASSENGER_IDCARD+"' placeholder='请输入身份证号'/> "+
							  			  " </div> "+
						  				  " </div> "+
						  				  " <div  class='odiv'> "+
										  " <div class='idiv'>联系方式</div> "+
							  			  " <div class='div_text' style='margin-right:20px;'> "+
							  			  " <input  type='text' class='ipt' name='passengerTelephone' value='"+passengerTelephone+"' placeholder='请输入联系方式'/> "+
							  			  " </div> "+
						  				  " </div> "+
						  				  " <div style='text-align:center;width:40%;height:35px;background: #CD3700;margin: 10px auto;color:#fff;line-height: 35px;border-radius:5px;' onclick='$(this).parent().remove();' >删除人员</div> "+
						  				  " </div> ";
							CkList.appendChild(div);
        				}
        			}
        		}else{
        			api.alert({msg:'初始信息错误！原因：'+ret.msg});
        		}
        	}else{
        		api.alert({msg:'初始信息错误！原因：'+err.msg});
        	}
        });
	};
	
	function choosePic(i){
		api.confirm({
    		title: '选择图片获取方式',
    		msg: ' ',
    		buttons: ['相机', '图册']
		}, function(ret, err) {
    		var index = ret.buttonIndex;
    		if(index=="1"){
    			api.getPicture({
    				sourceType:'camera',
    				encodingType:'jpg',
    				quality:100,
    				targetWidth: 600,
    				targetHeight: 600,
    				destinationType:'base64'
                },function(ret,err){
                	if(ret){
	                	if(ret.data.length>0){
	                		document.getElementById("clzp").src = ret.base64Data;   
            				$("#pic").val(ret.data); 
	                	}
                		
                	}
                });
    		}else if(index=="2"){
    			api.getPicture({
    				sourceType:'library',
    				encodingType:'jpg',
    				quality:100,
    				targetWidth: 600,
    				targetHeight: 600,
    				destinationType:'base64'
                },function(ret,err){
	                if(ret){
	                	if(ret.data.length>0){
	                		document.getElementById("clzp").src = ret.base64Data; 
            				$("#pic").val(ret.data);
	                	}
	                }
                });
    		}
		});
	}
	
	function toindex(){
		api.closeWin();
	}
	
	function addCk(){
		var CkList = document.getElementById("CkList");
		var div = document.createElement("div");
		
		div.innerHTML="<div style='border-top:2px solid #555555;border-bottom:2px solid #555555;margin-top:5px;'> "+
					  " <div class='odiv'> "+
					  " <div class='idiv'>姓名</div> "+
		  			  " <div class='div_text' style='margin-right:20px;'> "+
		  			  " <input  type='text' class='ipt' name='passengerName' placeholder='请输入人员姓名'/> "+
		  			  " </div> "+
	  				  " </div> "+
	  				  " <div class='odiv'> "+
					  " <div class='idiv'>身份证号</div> "+
		  			  " <div class='div_text' style='margin-right:20px;'> "+
		  			  " <input  type='text' class='ipt' name='passengerIdcard' placeholder='请输入身份证号'/> "+
		  			  " </div> "+
	  				  " </div> "+
	  				  " <div  class='odiv'> "+
					  " <div class='idiv'>联系方式</div> "+
		  			  " <div class='div_text' style='margin-right:20px;'> "+
		  			  " <input  type='text' class='ipt' name='passengerTelephone' placeholder='请输入联系方式'/> "+
		  			  " </div> "+
	  				  " </div> "+
	  				  " <div style='text-align:center;width:40%;height:35px;background: #CD3700;margin: 10px auto;color:#fff;line-height: 35px;border-radius:5px;' onclick='$(this).parent().remove();' >删除人员</div> "+
	  				  " </div> ";
		CkList.appendChild(div);
	}
	function updateCL(){
		if(is_audit==1){
			api.alert({msg:"已审核信息不允许修改！"});
			return;
		}
		var enterDate = $("#enterDate").val();
	    var leaveDate = $("#leaveDate").val();
	    var enterReason = $("#enterReason").val();
	    if(enterDate == "" || leaveDate == ""){
	       api.alert({msg: "请选择进出沟日期"});
	       return;
	    }
	    if(enterReason == ""){
	       api.alert({msg: "请输入进沟事由"});
	       return;
	    } 
		var driverName = $("#driverName").val();
		if(driverName==null||driverName==""||driverName==undefined){
			api.alert({msg:"请输入人员姓名！"});
			return;
		}
		var driverCard = $("#driverCard").val();
		if(driverCard==null||driverCard==""||driverCard==undefined){
			api.alert({msg:"请输入身份证！"});
			return;
		}
		var plateNum = $("#plateNum").val();
		if(haveCar){
			if(plateNum==null||plateNum==""||plateNum==undefined){
				api.alert({msg:"请输入车牌号！"});
				return;
			}
		}
		var driverTelephone = $("#driverTelephone").val();
		if(driverTelephone==null||driverTelephone==""||driverTelephone==undefined){
			api.alert({msg:"请输入驾驶员联系方式！"});
			return;
		}
		var passengerNames ="";
		var passengerIdcards ="";
		var count =0;
		var num = 0;
		var flag=true;
		$("input[name='passengerName']").each(function(){
			var passengerName = $(this).val();
			if(passengerName==null||passengerName==""||passengerName==undefined){
				flag=false;
				api.alert({msg:"乘客姓名不能为空！"});
				return false;//each返回false只能提前终止循环，不能终止程序向下执行
			}else{
				if(count==0){
					passengerNames = passengerNames+passengerName;
					count++;
				}else{
					passengerNames = passengerNames+","+passengerName;
				}
			}
		});
		$("input[name='passengerIdcard']").each(function(){
			var passengerName = $(this).val();
			if(passengerName==null||passengerName==""||passengerName==undefined){
				flag=false;
				api.alert({msg:"身份证号不能为空！"});
				return false;//each返回false只能提前终止循环，不能终止程序向下执行
			}else{
				if(num==0){
					passengerIdcards = passengerIdcards+passengerName;
					num++;
				}else{
					passengerIdcards = passengerIdcards+","+passengerName;
				}
			}
		});
		if(flag){
			var passengerTelephones = $("input[name='passengerTelephone']").map(function(){if($(this).val()==null||$(this).val()==""||$(this).val()==undefined){ return " ";}else{return $(this).val();}}).get().join(",");
			var uiId;
			var UILoading = api.require('UILoading');
			UILoading.flower({
	            center: {
		            x: api.winWidth/2.0,
		            y: api.winHeight/2.0
	            },
	            size: 30,
	            fixed: true,
	            mask: "rgba(0,0,0,0.5)"
            },function(ret,err){
            	uiId = ret.id;
            });
            var callback = function(ret,err){
            	UILoading.closeFlower({
	                id: uiId
                });
                if(ret){
                	if(ret.success){
                		//api.alert({msg: "修改成功！"});
			           	api.sendEvent({
			                 name:'updCk'
		                });
		                api.closeWin();
                	}else{
                		api.alert({msg: "修改失败！原因："+ret.msg});
                	}
                }else{
                	api.alert({msg:"修改失败，原因："+err.msg});
            	}
			};
			var path;
			//clck_type 0 管理人员 1普通车主
			var clck_type = api.pageParam.clck_type;
			var clzp="";
			if(clck_type==0){
				clzp = $("#clzp").attr("src");
				path= url.updateSceneryInfo;
			}else{
				path=url.updateDriverInfo;
			}
			var id = $("#id").val();
			var car_no = "";
			if(haveCar){
			  car_no = plateNum;
			}
			var content = {"id":id,"driverName":driverName,"driverCard":driverCard,"plateNum":car_no,"driverTelephone":driverTelephone,"enterDate":enterDate,"leaveDate":leaveDate,"enterReason":enterReason,
			"passengerNames":passengerNames,"passengerIdcards":passengerIdcards,"passengerTelephones":passengerTelephones,"clzp":clzp};
			apiAjax(JSON.stringify(content),path,callback);
		}
	}
	
	function deleteCL(){
		if(is_audit==1){
			api.alert({msg:"已审核信息不允许删除！"});
			return;
		}
		var uiId;
		var UILoading = api.require('UILoading');
		UILoading.flower({
            center: {
	            x: api.winWidth/2.0,
	            y: api.winHeight/2.0
            },
            size: 30,
            fixed: true,
            mask: "rgba(0,0,0,0.5)"
        },function(ret,err){
        	uiId = ret.id;
        });
        //clck_type 0 管理人员 1普通车主
		var clck_type = api.pageParam.clck_type;
        var callback = function(ret,err){
        	UILoading.closeFlower({
                id: uiId
            });
            if(ret){
            	if(ret.success){
            		if(clck_type==1){
            			var cl_defid = $api.getStorage("cl_defid");
	            		if(id==cl_defid){
	            			$api.setStorage("cl_defid",null);
	            		}
            		}
            		//api.alert({msg: "删除成功！"});
		           	api.sendEvent({
		                 name:'delCk'
	                });
	                api.closeWin();
            	}else{
            		api.alert({msg: "删除失败！原因："+ret.msg});
            	}
            }else{
            	api.alert({msg:"删除失败，原因："+err.msg});
        	}
		};
		var id = $("#id").val();
		var content = {"id":id};
		var path;
		if(clck_type==0){
			path= url.deleteSceneryInfo;
		}else{
			path=url.deleteDriverInfo;
		}
		apiAjax(JSON.stringify(content),path,callback);
	}
</script>
</html>